<template>
  <div class="log-main">
    <!-- 用于快速加载登录数据，并到选择农场 -->
    <div class="login-container">
      <img
        src="../../assets/login/zhloading.png"
        width="88px"
        class="login-ana"
      />
    </div>
  </div>
</template>

<script>
import { validUsername } from "@/utils/validate";
import { getToken, setToken, removeToken } from "@/utils/auth"; // get token from cookie
import userService from "@/api/user/index";
import { getpasCookie } from "@/utils/cookie";
export default {
  name: "LoginLoading",
  data() {
    const validateUsername = (rule, value, callback) => {
      if (!validUsername(value)) {
        callback(new Error("请输入用户名"));
      } else {
        callback();
      }
    };
    const validatePassword = (rule, value, callback) => {
      if (value.length < 6) {
        callback(new Error("密码不得小于六位"));
      } else {
        callback();
      }
    };
    return {
      remberMsg: false,
      loginForm: {
        // account: "jg",
        // password: "123456"
        account: "",
        password: ""
      },
      loginRules: {
        account: [
          { required: true, trigger: "blur", validator: validateUsername }
        ],
        password: [
          { required: true, trigger: "blur", validator: validatePassword }
        ]
      },
      loading: false,
      passwordType: "password",
      redirect: undefined
    };
  },
  watch: {
    $route: {
      handler: function(route) {
        this.redirect = route.query && route.query.redirect;
      },
      immediate: true
    }
  },
  mounted() {
    // sessionStorage.clear();
    this.getquery();
  },
  created() {
    // if (this.$store.state.permission.addRoutes.length > 0) { // 判断是否已经刷新
    //   location.reload()
    // }
    // removeToken("databaseName");
  },
  methods: {
    getquery() {
      let tr = this.$route.query;
      if (tr.organizationNo) {
        setToken("organizationNo", tr.organizationNo);
      }
      if (tr.virtualSystemNo) {
        setToken("virtualSystemNo", tr.virtualSystemNo);
      }
      if (tr.entrance_flag) {
        setToken("entrance_flag", tr.entrance_flag);
      }
      setToken("farmingTypeNoQuery", tr.farmingTypeNo || '');
      this.loginForm.account = decodeURIComponent(tr.account);
      this.loginForm.password = tr.password;
      if (tr.account) {
        this.handleLogin();
      } else if (tr.token) {
        // 避免明文 url 链接
        // this.inputStuats = 2;
        let token = decodeURIComponent(
          window.location.href.split("?")[1].split("=")[1]
        ).replace(/ /g, "+");
        let obj = getpasCookie(token);
        this.loginForm.account = obj.account;
        this.loginForm.password = obj.password;
        setTimeout(() => {
          this.handleLogin(2);
        }, 200);
      } else {
        this.$message.warning("用户数据不完整，即将跳转登录页面！");
        setTimeout(() => {
          this.$router.push({
            path: "/login"
          });
        }, 1000);
      }
    },
    // 注册用户
    toreguser() {
      this.$router.push({ path: "/register-user" });
    },
    showPwd() {
      if (this.passwordType === "password") {
        this.passwordType = "";
      } else {
        this.passwordType = "password";
      }
      this.$nextTick(() => {
        this.$refs.password.focus();
      });
    },
    handleLogin() {
      this.loading = true;
      this.$store
        .dispatch("user/login", this.loginForm)
        .then(() => {
          this.loading = false;
          // this.$router.push({ path: this.redirect || "/" });
          // this.$router.push({ path: "/choose-company" });
          if (getToken('entrance_flag') == 'IADPLO' && getToken('databaseName') && getToken('organizationNo') && getToken('virtualSystemNo')) {
            // this.$router.push({ path: "/choose-company" });
            this.$router.push({ name: "ZhControlView" });
          } else {
            // setToken("entrance_flag", 'IADP');
            this.$router.push({ path: "/choose-company" });
          }
        })
        .catch(() => {
          this.$message.warning(
            "用户账号/密码错误(或已被加入黑名单),请确认后重试或联系管理员"
          );
          this.loading = false;
          setTimeout(() => {
            this.$router.push({
              path: "/login"
            });
          }, 1000);
        });
    },
    // 主要用于登录完判断进入哪个页面--暂时没什么用
    gotoview() {
      // 获取顶级组织结构id,
      userService.organizationTop().then(res => {
        let companylist = res.data;
        alert(companylist.length);
        if (companylist.length > 1) {
          this.$router.push({
            path: "/select-farm",
            query: { id: companylist[0]["companyId"] }
          });
        } else if (companylist.length === 1) {
          this.$router.push({
            path: "/choose-company",
            query: { id: companylist[0]["companyId"] }
          });
        }
      });

      this.loading = false;
    }
  }
};
</script>

<style lang="scss">
/* 修复input 背景不协调 和光标变色 */
/* Detail see https://github.com/PanJiaChen/vue-element-admin/pull/927 */

$bg: #283443;
$light_gray: #fff;
$cursor: #fff;

@supports (-webkit-mask: none) and (not (cater-color: $cursor)) {
  .login-container .el-input input {
    color: $cursor;
  }
}
</style>

<style lang="scss" scoped>
$bg: #2d3a4b;
$dark_gray: #889aa4;
$light_gray: #eee;
.log-main {
  width: 100%;
  height: 100%;
  background: linear-gradient(
    150.62deg,
    rgba(0, 203, 134, 1) 0%,
    rgba(31, 124, 135, 1) 100%,
    rgba(26, 135, 133, 1) 100%
  );
  overflow: hidden;
}
// .log-main::-webkit-scrollbar { width: 0 !important }
.login-container {
  min-height: 100%;
  width: 100%;
  background-size: 100% 100% !important;
  background-attachment: fixed !important;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  .login-ana {
    animation: mymove 3s linear infinite;
  }
  @keyframes mymove {
    0% {
      transform: rotate(0deg);
    }
    //  25%  {transform: rotate(25 deg);}
    //  50%  {transform: rotate(360deg);}
    //  75%  {transform: rotate(0);}
    100% {
      transform: rotate(1turn);
    }
  }
}
</style>
